<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理员角色</title>
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/plugins/dataTables/dataTables.bootstrap.css">
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/style.css">
    <link rel="stylesheet" type="text/css" href="/static/layer/skin/layer.css">
    <link rel="stylesheet" type="text/css" href="/static/paging/paging.css">
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <form action="/role/lists" method="get">
                        <table style="width: 100%;padding: 0;border: none">
                            <tr>
                                <td>
                                    <a href="javascript:;" class="btn btn-sm btn-success" id="add">添加</a>
                                    <a href="javascript:;" class="btn btn-sm btn-info" data-action="delAll">批量删除</a>
                                </td>
                                <td>&nbsp;</td>
                            </tr>
                        </table>
                    </form>
                </div>
                <div class="ibox-content">
                    <table id="treeTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/hplus/js/jquery.min.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/layer/layer.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/royui/royui.min.js?v={php}echo time(){/php}"></script>
<script>
    $(function () {
        let $data = JSON.parse('<?php echo json_encode($list); ?>');
        new royui().treeTable({
            data: $data,
            paging: true,
            show_pages: 5,
            pages: {$pages},
            checkbox: true,
            cols: [
                {
                    field: 'role_name',
                    title: '名称'
                },
                {
                    field: 'ctime',
                    title: '添加时间'
                },
                {
                    field: 'status_txt',
                    title: '状态'
                },
                {
                    title: '操作',
                    action: [{matter: 'del', url: '/admin/del'}]
                }
            ]
        })
        //添加角色
        $('#add').click(function () {
            layer.open({
                type: 2,
                title: '添加管理员角色',
                content: '/role/add',
                area: ['420px', '260px'],
                closeBtn: 2,
                btn: ['确定', '取消'],
                yes: function ($index, $layero) {
                    let $body = $layero.find('iframe').contents().find('body');
                    let $param = decodeURIComponent($($body).find('form').serialize());
                    $param = $param.split('&');
                    let $params = {};
                    $($param).each(function ($n, $obj) {
                        $params[$obj.split('=')[0]] = $obj.split('=')[1];
                    });
                    $.ajax({
                        type: 'post', dataType: 'json', cache: false,
                        url: '/role/add',
                        data: $params,
                        success: function ($data) {
                            if ($data['code'] === 200) {
                                layer.msg($data.message, {icon: 1, time: 1200}, function () {
                                    window.location.reload();
                                });
                            } else {
                                layer.msg($data.message, {icon: 5});
                            }
                        }
                    })
                }
            })
        })
        $('body').on('click', 'a[data-action]', function () {
            let $action = $(this).data('action'), $id = $(this).data('id');
            let $ids = []
            if ($action === 'del' || $action === 'disable' || $action === 'enable' || $action === 'mip' || $action === 'nip') {
                $ids = [$id];
            } else if ($action === 'delAll' || $action === 'disableAll' || $action === 'enableAll' || $action === 'mipAll' || $action === 'nipAll') {
                $('.royui_checkbox').each(function () {
                    if ($(this).is(':checked')) {
                        $ids.push($(this).val())
                    }
                });
            }
            operate($ids, $action)
        });

        function operate($ids, $type) {
            let $msg = '', $tip = '';
            if ($type === 'del' || $type === 'delAll') {
                $msg = '确实要删除吗？';
                $tip = '删除'
            } else if ($type === 'disable' || $type === 'disableAll') {
                $msg = '确实要禁用吗？';
                $tip = '禁用'
            } else if ($type === 'enable' || $type === 'enableAll') {
                $msg = '确实要启用吗？';
                $tip = '启用'
            }
            if ($ids.length === 0) {
                layer.msg('请选择要' + $tip + '的项');
                return false
            }
            layer.confirm($msg, {icon: 3}, function () {
                $.ajax({
                    type: 'post', cache: false, dataType: 'json',
                    url: '/role/operate',
                    data: {'ids': $ids, 'type': $type},
                    success: function (data) {
                        if (data.code === 200) {
                            layer.msg(data.message, {icon: 1, time: 1000}, function () {
                                location.reload();
                            });
                        } else {
                            layer.msg(data.message, {icon: 5})
                        }
                    }
                })
            })
        }
    });
</script>
</html>
